<template>
    <Codemirror
        v-model:value="props.code"
        :options="cmOptions"
        border
        placeholder="test placeholder"
        @change="change"
    />
</template>

<script lang="ts" setup >
import {ref,reactive} from "vue"
import Codemirror from "codemirror-editor-vue3";
import { InstallCodemirro } from "codemirror-editor-vue3";
// 语言
// import "codemirror/mode/javascript/javascript.js";
// placeholder
// import "codemirror/addon/display/placeholder.js";
// 主题
// import "codemirror/theme/dracula.css";
const props = defineProps({
    code: {
        type: String,
        default: `
var i = 0;
for (i; i < 9; i++) {
    console.log(i);
    // more statements
}`
    }
})
const cmOptions = reactive({
    mode: "text/javascript",
    theme: "dracula",
})
const change = () => {

}
</script>

<style scoped lang = "scss">

</style>
